<template>
  <div class="views-container">
    <div class="wlm-table" v-if="isbtn==false">
      <div class="wlm-table-hearder-btn">
        <div class="top-box">
          <div style="display:flex;padding:10px;">
            <img
              src="../../assets/custorm_style/default_picture.png"
              style="width:100px;height:100px;"
            />
            <div>
              <p
                style="font-weight: bold;font-size: 17px;padding: 10px 0  0 10px"
              >
                城市代理
              </p>
              <p
                style="font-size: 14px;padding-left: 10px;padding:20px 0 0 10px;"
              >
                城市代理是对内加盟，对外合伙的一个整体，它集中式管理，分散了直营风险，管理紧密
              </p>
            </div>
          </div>
        </div>
        <div style="padding:300px;text-align: center;">
          <el-button type="success" @click="openbtn">开启城市代理</el-button>
        </div>
      </div>
    </div>
    <div class="wlm-form" v-if="isbtn==true">
      <div class="wlm-form-header">代理设置</div>
      <div class="wlm-form-content">
        <!-- :model="formFormatData.formData" :rules="formFormatData.rules" -->
        <el-form
          ref="platform"
          size="small"
          label-width="180px"
          class="retail-form"
          label-position="right"
          :model="formFormatData.formData"
        >
          <el-form-item label="开启代理">
            <!-- <el-input type="textarea" v-model.trim="formFormatData.formData.share_title" :autosize="{ minRows: 1, maxRows: 4}" style="width:80%;"></el-input> -->
            <el-switch active-value="1" inactive-value="0" v-model="formFormatData.formData.open" @change="switchbtn"></el-switch>
          </el-form-item>
           <!-- <el-form-item label="默认定位">
             <el-input v-model="formFormatData.formData.default_area" placeholder="请输入默认定位"></el-input>
             <div class="form-help">例：成都市</div>
           </el-form-item> -->
          <!-- <el-form-item label="商户预留金额">
              <el-input-number :controls="false" v-model="formFormatData.formData.reserved_fund" placeholder="" style="width:300px;"></el-input-number>
          </el-form-item>
          <el-form-item label="提现金额限制">
              <el-input-number :controls="false" v-model="text_one"></el-input-number>至<el-input-number :controls="false" v-model="text_two"></el-input-number>
          </el-form-item> -->
            <el-form-item label="是否提示切换地区">
              <el-switch active-value="1" inactive-value="0" v-model="formFormatData.formData.tip_switch"></el-switch>
            </el-form-item>
          <el-form-item label="是否自动切换" v-if="formFormatData.formData.tip_switch==0">
               <!-- <el-radio-group v-model="formFormatData.formData.tip_switch">
                  <el-radio label="0">不自动切换</el-radio>
                  <el-radio label="1">自动切换</el-radio>
                </el-radio-group> -->
                <el-switch active-value="1" inactive-value="0" v-model="formFormatData.formData.auto_switch"></el-switch>
          </el-form-item>
          <el-form-item label="打款方式">
                  <el-checkbox-group v-model="formFormatData.formData.pament_type" >
                            <el-checkbox v-for="role in roledata" :label="role.value" :key="role.value">
                               {{role.label}}
                            </el-checkbox>
                          
                      </el-checkbox-group>
          </el-form-item>
          <el-form-item label="微信打款账号">
             <el-select v-model="formFormatData.formData.pament_type_wechat" placeholder="请选择">
              <el-option
                v-for="item in paydata"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
           <!-- <el-form-item label="支付宝打款账号">
          
          </el-form-item> -->
           <el-form-item label="默认商家提现手续费">
                <el-input v-model="formFormatData.formData.bus_rate">
                 <template slot="append">%</template>
                </el-input>
                <div class="form-help">代理设置中未设置时，会调用此比例</div>
                 
          </el-form-item>
           <el-form-item label="默认代理提现手续费">
           <el-input v-model="formFormatData.formData.agent_rate">
            <template slot="append">%</template>
           </el-input>
                <div class="form-help">代理设置中未设置时，会调用此比例</div>

          </el-form-item>
        </el-form>
      </div>
    </div>

    <!-- 保存 -->
    <div v-cloak class="wlm-fixed-btn flex-row flex-align-c flex-justify-c" >
      <!-- @click="saveForm" -->
      <el-button size="small" @click="saveForm" type="primary" v-if="isbtn==true" :loading="loading">保存</el-button>
    </div>
  </div>
</template>
<script>
import {agentSaveSetting,agentGetSetting} from "@/api/cityagent"
import {
  paymentIndex,
} from '@/api/setting'

import mixins from "@/mixins/mixins";
export default {
  mixins: [mixins.getters("Form")],
  name: "proxysettings",
  data() {
    return {
        isbtn:false,
        loading:false,
        // text_one:"",
        // text_two:"",
        paydata:[],
        roledata:[ 
            {label:'微信',value:'wechat'},
            // {label:'支付宝',value:'alipay'},
            {label:'银行卡',value:'card'},
            ],
        formFormatData: {
        key: 'platform',
        api: {
          editForm: {
            // api: agentGetSetting,
            params: {
              always: true
            },
            filters: {
              img: {
                // bindInit: ['chooseLogoConfig', 'chooseCopyrightConfig', 'chooseLogoConfigs', 'chooseCopyrightConfigs','chooseshangConfigs','chooseHaoConfigs']
              }
            }
          },
        //   submitForm: agentSaveSetting
        },
        formData: {
          // default_area:'',
          open:'0',
          reserved_fund:'',
          withdraw_limit:[],
          pament_type:[],
          tip_switch:'0',
          auto_switch:'0',
          pament_type_wechat:'',
          bus_rate:'',
          agent_rate:'',
        },
      
      }
    };
  },
  created () {
       this.paydatabtn()
    this.agentGetSettingbtn()
  },
  methods: {
      openbtn(){
          this.isbtn ==true ? this.isbtn = false : this.isbtn =true
          // this.formFormatData.formData.open="1"
      },
       agentGetSettingbtn(){
          this.isbtn ==true ? this.isbtn = false : this.isbtn =true
          agentGetSetting().then(res=>{
            if(res.data.code==1){
              if(res.data.data.length==0){
               this.isbtn = false
              }else{
              this.formFormatData.formData = res.data.data.agent
              }
              //如果接口返回回来的数据存在agent，就赋值
              //     if(!Array.isArray(res.data.data.agent.pament_type)){
              //     res.data.data.agent.pament_type = []
              //    if(res.data.data.agent.open=='0'){
              //     this.isbtn=false
              //   }
              // }
            }
          })
       },
      paydatabtn(){
        paymentIndex().then(res=>{
          console.log("fdsfdsfdff",res)
          if(res.data.code==1){
            res.data.data.map(item=>{
              if(item.type==1){
                this.paydata.push({label:item.name,value:item.id.toString()})
              }
            })
            // this.paydata = 
          }
        })
      },
        switchbtn(){
            if(this.formFormatData.formData.open =="0"){
                // this.isbtn = false
            this.formFormatData.formData.open =="0"

            }
        },
        saveForm(){
                  this.formFormatData.formData.withdraw_limit=[]
                // this.formFormatData.formData.withdraw_limit.push(this.text_one,this.text_two)
                this.loading = true
                    agentSaveSetting({agent:this.formFormatData.formData,type:'agent'}).then(res=>{
                        console.log(":fdsfdsfds",res)
                        if(res.data.code==1){
                            this.$message.success("保存成功！")
                            this.loading = false
                            setTimeout(()=>{
                            this.$router.go(0);                            
                            },500)
                        }
                })
            
        },
     

  }
};
</script>
<style lang="scss" scoped>
.top-box {
  border: 1px solid #ffb1ac;
  background: #fff1f0;
}
</style>
